/*
* @Author: kalung.di
* @describe: 图谱资源
* @Date:   2017-03-27 00:33:29
* @Last Modified by:   kalung.di
* @Last Modified time: 2017-05-13 00:47:12
*/

$(function() {

  var cardData = {
    tittle: '公共领域图谱资源',
    more: 'http://usources.cn/ziyuan.html',
    items: [
      {
        img: 'http://wiki.dbpedia.org/sites/default/files/dbpedia_plain.png',
        tittle: 'DBPedia',
        time: '2016-10-12',
        from: '维基百科(外部资源)',
        industry: '公共知识库',
        introduce: '它从维基百科(Wikipedia)的词条里撷取出结构化的资料，以强化维基百科的搜寻功能，并将其他资料集连结至维基百科。DBpedia 同时也是世界上最大的多领域知识本体之一，也是 Linked Data 的一部分，美国科技媒体 ReadWriteWeb 也将 DBpedia 选为2009 年最佳的语义网应用服务。',
        load: 'http://wiki.dbpedia.org/downloads-2016-04'
      },
      {
        img: './images/logo_blue.png',
        tittle: '中国医疗机构图谱',
        time: '2017-05-01',
        from: '众源平台',
        industry: '政府机构',
        introduce: '由众源生成的，含有所有北京上海深圳的所有医疗机构信息（如名称，地址，电话等属性）。数据由RDF合并而来，经过清洗生成统一的概念图，组织多源的实例数据。',
        download: {
          owl:'http://www.usources.cn/downLoad/owls/usources_cn/MedicalKG.owl',
          rdf:'http://www.usources.cn/downLoad/rdfs/usources_cn/MedicalKG.nt'
        }
        //load: 'http://wiki.dbpedia.org/downloads-2016-04'
      },
    ],
  };

  var TEMP = $.easyTemplate(
      '<#et cardBox cardData>'+
        //'<div class="WB_frame_a">'+
          //'<div class="WB_cardwrap S_bg2">'+
            '<div class="PCD_admin_app PCD_admin_app_col2">'+
              '<div class="WB_cardtitle_b S_line2">'+
                '<div class="obj_name"><h2 class="main_title W_fb W_f14">${cardData.tittle}</h2></div>'+
              '</div>'+
              '<div class="WB_innerwrap">'+
                '<div class="m_wrap">'+
                  '<ul class="app_list_box clearfix">'+
                    '<#list cardData.items as item>'+
                      '<li class="item_box ">'+
                        '<div class="pic_wrap">'+'<img src="${item.img}" class="pic">'+'</div>'+
                        '<div class="info_wrap S_line1">'+
                          '<div class="app_title W_autocut"><a href="#1" class="W_autocut S_txt1">${item.tittle}</a></div>'+
                          '<div class="app_time S_txt2">'+
                            '<a href="#1" class="S_txt2">${item.time}</a>'+
                            ' 来自 '+
                            '<a href="#1" class="S_txt2">${item.from}</a>'+
                            ' '+
                            '<a href="#1" class="S_txt2">${item.industry}</a>'+
                          '</div>'+
                          '<div class="app_content app_autocut">${item.introduce}</div>'+
                          '<div class="btn_box">'+
                            '<#if (item.load)><span class="btn_bed"><a href="${item.load}" class="W_btn_b" target="_blank">下载链接</a></span>'+
                            '<#elseif (item.download)><span class="btn_bed"><a href="${item.download.owl}" class="W_btn_b" target="_blank">OWL下载</a></span>'+
                            '<span class="btn_bed"><a href="${item.download.rdf}" class="W_btn_b" target="_blank">RDF下载</a></span>'+
                            '</#if>'+
                          '</div>'+
                        '</div>'+
                      '</li>'+
                    '</#list>'+
                  '</ul>'+
                '</div>'+
              '</div>'+
              //'<a href="${cardData.more}" class="WB_cardmore S_txt1 S_line1 clearfix"> <span class="more_txt">查看更多</span></a>'+
            '</div>'+
          //'</div>'+
        //'</div>'+
      '</#et>');

  var industry, 
    itemBox, 
    parseDom,
    handles,
    bind,
    init; 

  parseDom = function() {
    industry = $('#industry');
  };

  handles  = {
    // 渲染card
    render: function(data) {
      var html = TEMP(data).toString();
      industry.html(html);
      itemBox = $('#industry .item_box');
    },
    // 移入item
    itemOver: function(evt) {
      var target = evt.delegateTarget;
      if (!$.isMouseLeaveOrEnter(evt, target)) return;
      $(target).addClass('S_bg1');
    },
    // 移出item
    itemOut: function(evt) {
      var target = evt.delegateTarget;
      if (!$.isMouseLeaveOrEnter(evt, target)) return;
      $(target).removeClass('S_bg1');
    },

  };

  bind = function() {
    handles.render(cardData);
    itemBox.on('mouseover', handles.itemOver);
    itemBox.on('mouseout', handles.itemOut);
  };

  init = function() {
    parseDom();
    bind();
  };

  init();

});


